var chart01 = echarts.init(document.getElementById('chart01'));
var chart02 = echarts.init(document.getElementById('chart02'));
var chart03 = echarts.init(document.getElementById('chart03'));
var chart04 = echarts.init(document.getElementById('chart04'));
var chart05 = echarts.init(document.getElementById('chart05'));
var chart06 = echarts.init(document.getElementById('chart06'));
var chart07 = echarts.init(document.getElementById('chart07'));
var chart08 = echarts.init(document.getElementById('chart08'));
$('.container').height($('body').height());
$('.echart-box').height(parseInt(($('.container').height()-170)/3));
$('#chart02').height(parseInt($('.echart-box').height()*2+30));
function loadEchart01(){
	var option01 = {
	    "animation": true,
	    "title": {
			show:false,
	        "text": 24,
	        "subtext": "沥青工",
	        "x": "center",
	        "y": "center",
	        "textStyle": {
	            "color": "#fff",
	            "fontSize": 14,
	            "fontWeight": "normal",
	            "align": "center",
	            "width": "200px"
	        },
	        "subtextStyle": {
	            "color": "#fff",
	            "fontSize": 14,
	            "fontWeight": "normal",
	            "align": "center"
	        }
	    },
	    "legend": {
			show:false,
	        "width": "70%",
	        "left": "center",
	        "textStyle": {
	            "color": "#fff",
	            "fontSize": 14
	        },
	        "icon": "circle",
	        "right": "0",
	        "bottom": "0",
	        "padding": [30, 60],
	        "itemGap": 40,
	        "data": ["测量工", "电焊工", "钢筋工", "沥青工", "安装工", "起重工", "养护工", "其它"]
	    },
	    "series": [{
	        "type": "pie",
	        "center": ["50%", "50%"],
	        "radius": ["40%", "53%"],
	        "color": ["#FEE449", "#00FFFF", "#00FFA8", "#9F17FF", "#FFE400", "#F76F01", "#01A4F7", "#FE2C8A"],
	        "startAngle": 135,
	        "labelLine": {
	            "normal": {
	                "length": 25
	            }
	        },
	        "label": {
	            "normal": {
	                "formatter": "{b|{b}:}  {per|{d}%} ",
	                "backgroundColor": "rgba(255, 147, 38, 0)",
	                "borderColor": "transparent",
	                "borderRadius": 4,
	                "rich": {
	                    "a": {
	                        "color": "#999",
	                        "lineHeight": 22,
	                        "align": "center"
	                    },
	                    "hr": {
	                        "borderColor": "#aaa",
	                        "width": "100%",
	                        "borderWidth": 1,
	                        "height": 0
	                    },
	                    "b": {
	                        "color": "#b3e5ff",
	                        "fontSize": 14,
	                        "lineHeight": 33
	                    },
	                    "c": {
	                        "fontSize": 14,
	                        "color": "#eee"
	                    },
	                    "per": {
	                        "color": "#FDF44E",
	                        "fontSize": 14,
	                        "padding": [5, 8],
	                        "borderRadius": 2
	                    }
	                },
	                "textStyle": {
	                    "color": "#fff",
	                    "fontSize": 14
	                }
	            }
	        },
	        "emphasis": {
	            "label": {
	                "show": true,
	                "formatter": "{b|{b}:}  {per|{d}%}  ",
	                "backgroundColor": "rgba(255, 147, 38, 0)",
	                "borderColor": "transparent",
	                "borderRadius": 4,
	                "rich": {
	                    "a": {
	                        "color": "#999",
	                        "lineHeight": 22,
	                        "align": "center"
	                    },
	                    "hr": {
	                        "borderColor": "#aaa",
	                        "width": "100%",
	                        "borderWidth": 1,
	                        "height": 0
	                    },
	                    "b": {
	                        "color": "#fff",
	                        "fontSize": 18,
	                        "lineHeight": 33
	                    },
	                    "c": {
	                        "fontSize": 14,
	                        "color": "#eee"
	                    },
	                    "per": {
	                        "color": "#FDF44E",
	                        "fontSize": 25,
	                        "padding": [5, 6],
	                        "borderRadius": 2
	                    }
	                }
	            }
	        },
	        "data": [{
	            "name": "测量工",
	            "value": 3
	        }, {
	            "name": "电焊工",
	            "value": 2
	        }, {
	            "name": "钢筋工",
	            "value": 26
	        }, {
	            "name": "沥青工",
	            "value": 24
	        }, {
	            "name": "安装工",
	            "value": 12
	        }, {
	            "name": "起重工",
	            "value": 11
	        }, {
	            "name": "养护工",
	            "value": 3
	        }, {
	            "name": "其它",
	            "value": 2
	        }]
	    }, {
	        "type": "pie",
	        "center": ["50%", "50%"],
	        "radius": ["35%", "36%"],
	        "label": {
	            "show": false
	        },
	        "data": [{
	            "value": 78,
	            "name": "实例1",
	            "itemStyle": {
	                "normal": {
	                    "color": {
	                        "x": 0,
	                        "y": 0,
	                        "x2": 1,
	                        "y2": 0,
	                        "type": "linear",
	                        "global": false,
	                        "colorStops": [{
	                            "offset": 0,
	                            "color": "#9F17FF"
	                        }, {
	                            "offset": 0.2,
	                            "color": "#01A4F7"
	                        }, {
	                            "offset": 0.5,
	                            "color": "#FE2C8A"
	                        }, {
	                            "offset": 0.8,
	                            "color": "#FEE449"
	                        }, {
	                            "offset": 1,
	                            "color": "#00FFA8"
	                        }]
	                    }
	                }
	            }
	        }]
	    }]
	}
	chart01.setOption(option01);
	chart01.resize();
}
function loadEchart02(){
	var points = [
	  {value: [118.8062, 31.9208],itemStyle:{color:'#4ab2e5'}}
	  , {value: [127.9688, 45.368],itemStyle:{color:'#4fb6d2'}}
	  , {value: [110.3467, 41.4899],itemStyle:{color:'#52b9c7'}}
	  , {value: [125.8154, 44.2584],itemStyle:{color:'#5abead'}}
	  , {value: [116.4551, 40.2539],itemStyle:{color:'#f34e2b'}}
	  , {value: [123.1238, 42.1216],itemStyle:{color:'#f56321'}}
	  , {value: [114.4995, 38.1006],itemStyle:{color:'#f56f1c'}}
	  , {value: [117.4219, 39.4189],itemStyle:{color:'#f58414'}}
	  , {value: [112.3352, 37.9413],itemStyle:{color:'#f58f0e'}}
	  , {value: [109.1162, 34.2004],itemStyle:{color:'#f5a305'}}
	  , {value: [103.5901, 36.3043],itemStyle:{color:'#e7ab0b'}}
	  , {value: [106.3586, 38.1775],itemStyle:{color:'#dfae10'}}
	  , {value: [101.4038, 36.8207],itemStyle:{color:'#d5b314'}}
	  , {value: [103.9526, 30.7617],itemStyle:{color:'#c1bb1f'}}
	  , {value: [108.384366, 30.439702],itemStyle:{color:'#b9be23'}}
	  , {value: [113.0823, 28.2568],itemStyle:{color:'#a6c62c'}}
	  , {value: [102.9199, 25.46639],itemStyle:{color:'#96cc34'}}
	  , {value: [119.4543, 25.9222]}
	  ]
	let index = -1;
    var option = {
	   geo: {
		   map: 'china',
		 aspectScale: 0.75, //长宽比
		 zoom: 1.1,
		 roam: false,
		 itemStyle: {
		   normal: {
			 areaColor: {
					   type: 'radial',
					   x: 0.5,
					   y: 0.5,
					   r: 0.8,
					   colorStops: [{
						   offset: 0,
						   color: '#09132c' // 0% 处的颜色
					   }, {
						   offset: 1,
						   color: '#274d68'  // 100% 处的颜色
					   }],
					   globalCoord: true // 缺省为 false
				   },
			 shadowColor:'rgb(58,115,192)',
			 shadowOffsetX: 6,
			 shadowOffsetY: 8
		   },
		   emphasis: {
			 areaColor: '#2AB8FF',
			 borderWidth: 0,
			 color: 'green',
			 label: {
			   show: false
			 }
		   }
		 },
		 regions: [{
		   name: '南海诸岛',
		   itemStyle: {
			   areaColor: 'rgba(0, 10, 52, 1)',
			   borderColor: 'rgba(0, 10, 52, 1)',
			   normal: {
				   opacity: 0,
				   label: {
					   show: false,
					   color: "#009cc9",
				   }
			   }
		   },
	
	
	   }],
	   },
	   series: [ {
		   type: 'map',
		   roam: false,
		   label: {
			   normal: {
				   show: true,
				   textStyle: {
					   color: '#1DE9B6'
				   }
			   },
			   emphasis: {
				   textStyle: {
					   color: 'rgb(183,185,14)'
				   }
			   }
		   },
	
		   itemStyle: {
			 normal: {
			  borderColor: 'rgb(147, 235, 248)',
			   borderWidth: 1,
			   areaColor: {
					   type: 'radial',
					   x: 0.5,
					   y: 0.5,
					   r: 0.8,
					   colorStops: [{
						   offset: 0,
						   color: '#09132c' // 0% 处的颜色
					   }, {
						   offset: 1,
						   color: '#274d68'  // 100% 处的颜色
					   }],
					   globalCoord: true // 缺省为 false
				   },
			 },
			 emphasis: {
				   areaColor: 'rgb(46,229,206)',
			   //    shadowColor: 'rgb(12,25,50)',
				   borderWidth: 0.1
			   }
		   },
		   zoom: 1.1,
	       roam: false,
		   map: 'china' //使用
		 },{
			   type: 'effectScatter',
			   coordinateSystem: 'geo',
			   showEffectOn: 'render',
			   zlevel:1,
			   rippleEffect: {
				   period: 15,
				   scale: 4,
				   brushType: 'fill'
			   },
			   hoverAnimation: true,
			   label: {
				   normal: {
					   formatter: '{b}',
					   position: 'right',
					   offset: [15, 0],
					   color: '#1DE9B6',
					   show: true
				   },
			   },
			   itemStyle: {
				   normal: {
					  color:'#1DE9B6',
					  shadowBlur: 10,
					  shadowColor: '#333'
				   }
			   },
			   symbolSize: 12,
			   data: points
		   }, //地图线的动画效果
		 {
			   type: 'lines',
			   zlevel: 2,
			   effect: {
				   show: true,
				   period: 4, //箭头指向速度，值越小速度越快
				   trailLength: 0.4, //特效尾迹长度[0,1]值越大，尾迹越长重
				   symbol: 'arrow', //箭头图标
				   symbolSize: 7, //图标大小
			   },
			   lineStyle: {
				   normal: {
					   color:'#1DE9B6'
					   /* function (value){ //随机颜色
					   
					   ['#f21347','#f3243e','#f33736','#f34131','#f34e2b',
					   '#f56321','#f56f1c','#f58414','#f58f0e','#f5a305',
					   '#e7ab0b','#dfae10','#d5b314','#c1bb1f','#b9be23',
					   '#a6c62c','#96cc34','#89d23b','#7ed741','#77d64c',
					   '#71d162','#6bcc75','#65c78b','#5fc2a0','#5abead',
					   '#52b9c7','#4fb6d2','#4ab2e5']
return "#"+("00000"+((Math.random()*16777215+0.5)>>0).toString(16)).slice(-6);
}*/,
					   width: 1, //线条宽度
					   opacity: 0.1, //尾迹线条透明度
					   curveness: .3 //尾迹线条曲直度
				   }
			   },
			   data: [
				   {coords: [[118.8062, 31.9208],[119.4543, 25.9222]],lineStyle:{color:'#4ab2e5'}}
				 , {coords: [[127.9688, 45.368],[119.4543, 25.9222]],lineStyle:{color:'#4fb6d2'}}
				 , {coords: [[110.3467, 41.4899],[119.4543, 25.9222]],lineStyle:{color:'#52b9c7'}}
				 , {coords: [[125.8154, 44.2584],[119.4543, 25.9222]],lineStyle:{color:'#5abead'}}
				 , {coords: [[116.4551, 40.2539],[119.4543, 25.9222]],lineStyle:{color:'#f34e2b'}}
				 , {coords: [[123.1238, 42.1216],[119.4543, 25.9222]],lineStyle:{color:'#f56321'}}
				 , {coords: [[114.4995, 38.1006],[119.4543, 25.9222]],lineStyle:{color:'#f56f1c'}}
				 , {coords: [[117.4219, 39.4189],[119.4543, 25.9222]],lineStyle:{color:'#f58414'}}
				 , {coords: [[112.3352, 37.9413],[119.4543, 25.9222]],lineStyle:{color:'#f58f0e'}}
				 , {coords: [[109.1162, 34.2004],[119.4543, 25.9222]],lineStyle:{color:'#f5a305'}}
				 , {coords: [[103.5901, 36.3043],[119.4543, 25.9222]],lineStyle:{color:'#e7ab0b'}}
				 , {coords: [[106.3586, 38.1775],[119.4543, 25.9222]],lineStyle:{color:'#dfae10'}}
				 , {coords: [[101.4038, 36.8207],[119.4543, 25.9222]],lineStyle:{color:'#d5b314'}}
				 , {coords: [[103.9526, 30.7617],[119.4543, 25.9222]],lineStyle:{color:'#c1bb1f'}}
				 , {coords: [[108.384366, 30.439702],[119.4543, 25.9222]],lineStyle:{color:'#b9be23'}}
				 , {coords: [[113.0823, 28.2568],[119.4543, 25.9222]],lineStyle:{color:'#a6c62c'}}
				 , {coords: [[102.9199, 25.46639],[119.4543, 25.9222]],lineStyle:{color:'#96cc34'}}
			   ]
		   }
	
	   ]
   };
   chart02.setOption(option);
   chart02.resize();
}
function loadEchart07(){
	const CubeLeft = echarts.graphic.extendShape({
	    shape: {
	        x: 0,
	        y: 0
	    },
	    buildPath: function(ctx, shape) {
	        const xAxisPoint = shape.xAxisPoint
	        const c0 = [shape.x, shape.y]
	        const c1 = [shape.x - 9, shape.y - 9]
	        const c2 = [xAxisPoint[0] - 9, xAxisPoint[1] - 9]
	        const c3 = [xAxisPoint[0], xAxisPoint[1]]
	        ctx.moveTo(c0[0], c0[1]).lineTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).closePath()
	    }
	})
	const CubeRight = echarts.graphic.extendShape({
	    shape: {
	        x: 0,
	        y: 0
	    },
	    buildPath: function(ctx, shape) {
	        const xAxisPoint = shape.xAxisPoint
	        const c1 = [shape.x, shape.y]
	        const c2 = [xAxisPoint[0], xAxisPoint[1]]
	        const c3 = [xAxisPoint[0] + 18, xAxisPoint[1] - 9]
	        const c4 = [shape.x + 18, shape.y - 9]
	        ctx.moveTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).lineTo(c4[0], c4[1]).closePath()
	    }
	})
	const CubeTop = echarts.graphic.extendShape({
	    shape: {
	        x: 0,
	        y: 0
	    },
	    buildPath: function(ctx, shape) {
	        const c1 = [shape.x, shape.y]
	        const c2 = [shape.x + 18, shape.y - 9]
	        const c3 = [shape.x + 9, shape.y - 18]
	        const c4 = [shape.x - 9, shape.y - 9]
	        ctx.moveTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).lineTo(c4[0], c4[1]).closePath()
	    }
	})
	echarts.graphic.registerShape('CubeLeft', CubeLeft)
	echarts.graphic.registerShape('CubeRight', CubeRight)
	echarts.graphic.registerShape('CubeTop', CubeTop)
	const MAX = [6000, 6000, 6000, 6000, 6000, 5000, 4000, 3000, 2000, 4000, 3000, 2000]
	const VALUE = [2012, 1230, 3790, 2349, 1654, 1230, 3790, 2349, 1654, 3790, 2349, 1654]
	var option07 = {
	    title: {
	        text: '',
	        top: 32,
	        left: 18,
	        textStyle: {
	            color: '#00F6FF',
	            fontSize: 24
	        }
	    },
	    grid: {
	        left: 20,
	        right: 40,
	        bottom: '9%',
	        top: 10,
	        containLabel: true
	    },
	    xAxis: {
	        type: 'category',
	        data: ['德州', '德城区', '陵城区', '禹城市', '乐陵市', '临邑县',
	            '平原县', '夏津县', '武城县', '庆云县', '宁津县', '齐河县'
	        ],
	        axisLine: {
	            show: true,
	            lineStyle: {
	                color: 'white'
	            }
	        },
	        offset: 20,
	        axisTick: {
	            show: false,
	            length: 9,
	            alignWithLabel: true,
	            lineStyle: {
	                color: '#7DFFFD'
	            }
	        },
	        axisLabel: {
	            fontSize: 10
	        }
	    },
	    yAxis: {
	        type: 'value',
	        axisLine: {
	            show: true,
	            lineStyle: {
	                color: 'white'
	            }
	        },
	        splitLine: {
	            show: false
	        },
	        axisTick: {
	            show: false
	        },
	        axisLabel: {
	            fontSize: 16
	        },
	        boundaryGap: ['20%', '20%']
	    },
	    series: [{
	        type: 'custom',
	        renderItem: function(params, api) {
	            const location = api.coord([api.value(0), api.value(1)])
	            return {
	                type: 'group',
	                children: [{
	                    type: 'CubeLeft',
	                    shape: {
	                        api,
	                        xValue: api.value(0),
	                        yValue: api.value(1),
	                        x: location[0],
	                        y: location[1],
	                        xAxisPoint: api.coord([api.value(0), 0])
	                    },
	                    style: {
	                        fill: 'rgba(7,29,97,.6)'
	                    }
	                }, {
	                    type: 'CubeRight',
	                    shape: {
	                        api,
	                        xValue: api.value(0),
	                        yValue: api.value(1),
	                        x: location[0],
	                        y: location[1],
	                        xAxisPoint: api.coord([api.value(0), 0])
	                    },
	                    style: {
	                        fill: 'rgba(10,35,108,.7)'
	                    }
	                }, {
	                    type: 'CubeTop',
	                    shape: {
	                        api,
	                        xValue: api.value(0),
	                        yValue: api.value(1),
	                        x: location[0],
	                        y: location[1],
	                        xAxisPoint: api.coord([api.value(0), 0])
	                    },
	                    style: {
	                        fill: 'rgba(11,42,106,.8)'
	                    }
	                }]
	            }
	        },
	        data: MAX
	    }, {
	        type: 'custom',
	        renderItem: (params, api) => {
	            const location = api.coord([api.value(0), api.value(1)])
	            return {
	                type: 'group',
	                children: [{
	                    type: 'CubeLeft',
	                    shape: {
	                        api,
	                        xValue: api.value(0),
	                        yValue: api.value(1),
	                        x: location[0],
	                        y: location[1],
	                        xAxisPoint: api.coord([api.value(0), 0])
	                    },
	                    style: {
	                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
	                                offset: 0,
	                                color: '#3B80E2'
	                            },
	                            {
	                                offset: 1,
	                                color: '#49BEE5'
	                            }
	                        ])
	                    }
	                }, {
	                    type: 'CubeRight',
	                    shape: {
	                        api,
	                        xValue: api.value(0),
	                        yValue: api.value(1),
	                        x: location[0],
	                        y: location[1],
	                        xAxisPoint: api.coord([api.value(0), 0])
	                    },
	                    style: {
	                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
	                                offset: 0,
	                                color: '#3B80E2'
	                            },
	                            {
	                                offset: 1,
	                                color: '#49BEE5'
	                            }
	                        ])
	                    }
	                }, {
	                    type: 'CubeTop',
	                    shape: {
	                        api,
	                        xValue: api.value(0),
	                        yValue: api.value(1),
	                        x: location[0],
	                        y: location[1],
	                        xAxisPoint: api.coord([api.value(0), 0])
	                    },
	                    style: {
	                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
	                                offset: 0,
	                                color: '#3B80E2'
	                            },
	                            {
	                                offset: 1,
	                                color: '#49BEE5'
	                            }
	                        ])
	                    }
	                }]
	            }
	        },
	        data: VALUE
	    }, {
	        type: 'bar',
	        label: {
	            normal: {
	                show: true,
	                position: 'top',
	                formatter: (e) => {
	                    switch (e.name) {
	                        case '10kV线路':
	                            return VALUE[0]
	                        case '公用配变':
	                            return VALUE[1]
	                        case '35kV主变':
	                            return VALUE[2]
	                        case '水':
	
	                    }
	                },
	                fontSize: 16,
	                color: '#fff',
	                offset: [4, -25]
	            }
	        },
	        itemStyle: {
	            color: 'transparent'
	        },
	        data: MAX
	    }]
	}
	chart07.setOption(option07,true);
	chart07.resize();
}
function loadEchart03(){
	var dataLine = [25, 33, 66, 50];
	var myColor = ["#FF5D88", "#8B76FF", "#3BFFA3", "#4397FF"];
	var option03 = {
		  grid: [
			{
			  left: '12%',
			  top: '8%',
			  right: '12%',
			  bottom: '8%'
			}
		  ],
		  xAxis: [
			{
			  max: 100,
			  show: false
			}
		  ],
		  yAxis: [
			{
			  axisTick: {
				  show: false
			  },
			  axisLine: {
				  show: false
			  },
			  axisLabel: {
				textStyle: {
				  color: "#fff",
				  fontSize: 18
				}
			  },
			  data: ["偏瘦", "正常", "偏胖", "肥胖"]
			},
			{
			  axisTick: "none",
			  axisLine: "none",
			  show: false,
			  axisLabel: {
				textStyle: {
				  color: "#fff",
				  fontSize: 16
				}
			  },
			  data: [1, 1, 1, 1]
			},
			{
			  axisLine: {
				lineStyle: {
				  color: "rgba(0,0,0,0)"
				}
			  },
			  data: []
			}
		  ],
		  series: [
			{
			  name: "条",
			  type: "bar",
			  stack: "b",
			  yAxisIndex: 0,
			  data: dataLine,
			  label: {
				normal: {
				  show: false,
				  position: "right",
				  distance: 10,
				  formatter: function(param) {
					return param.value + "%";
				  },
				  textStyle: {
					color: "#2F6781",
					fontSize: 16
				  }
				}
			  },
			  barWidth: 25,
			  itemStyle: {
				normal: {
				  color: function(params) {
					var num = myColor.length;
					return myColor[params.dataIndex];
				  }
				}
			  },
			  z: 2
			},
			{
			  name: "框",
			  type: "bar",
			  yAxisIndex: 1,
			  barGap: "-100%",
			  data: [100, 100, 100, 100],
			  barWidth: 27,
			  itemStyle: {
				normal: {
				  color: "#2F6781"
				}
			  },
			  z: 1,
			  label: {
				normal: {
				  show: true,
				  position: "right",
				  distance: 8,
				  formatter: function(data) {
					return dataLine[data.dataIndex] + "%";
				  },
				  textStyle: {
					color: "#fff",
					fontSize: 16
				  }
				}
			  }
			}
		  ]
		}
		chart03.setOption(option03);
		chart03.resize();	
}
function loadEchart04(){
	var myData = ['低压居民', '低压非居民', '高压单电源', '高压双电源']
	var lineData = [100, 100, 100, 100]

	var thisYearData = {
		1: [11, 38, 23, 39]
	}
	var timeLineData = [1]
	var background = "#0e2147"; //背景 

	var option04 = {
		baseOption: {
			timeline: {
				show: false,
				top: 0,
				data: []
			},
			legend : {
				top : '4%',
				left : '5%',
				itemWidth : 14,
				itemHeight : 14,
				itemGap: 343,
				icon : 'horizontal',
				textStyle : {
					color : '#ffffff',
					fontSize : 14,
				},
				data: ['2020']
			},
			grid: [{
				show: false,
				left: '15%',
				right: '5%',
				top: '12%',
				bottom: '8%',
				containLabel: true,
				width: '80%'
			},
			{// 进度条左侧文字位置调整 -- 开始 
				show: false,
				left: '10%',
				top: '12%',
				bottom: '8%', // 进度条左侧文字之间的间距
				width: '0%'
			},// 进度条左侧文字位置调整 -- 结束
			{// 进度条位置调整 -- 开始 
				show: false,
				left: '18%',
				top: '12%',
				bottom: '8%', // 进度条之间的间距
				containLabel: true,
				width: '70%'
			}// 进度条位置调整 -- 结束
			],
			xAxis: [{
				type: 'value',
				inverse: true,
				axisLine: {
					show: false
				},
				axisTick: {
					show: false
				},
				position: 'top',
				axisLabel: {
					show: false
				},
				splitLine: {
					show: false
				}
			}, {
				gridIndex: 1,
				show: false
			}, {
				gridIndex: 2,
				axisLine: {
					show: false
				},
				axisTick: {
					show: false
				},
				position: 'top',
				axisLabel: {
					show: false
				},
				splitLine: {
					show: false
				}
			}],
			yAxis: [{
				type: 'category',
				inverse: true,
				position: 'right',
				axisLine: {
					show: false
				},
				axisTick: {
					show: false
				},
				axisLabel: {
					show: false
				},
				data: myData
			}, {
				gridIndex: 1,
				type: 'category',
				inverse: true,
				position: 'left',
				axisLine: {
					show: false
				},
				axisTick: {
					show: false
				},
				axisLabel: {
					show: true,
					textStyle: {
						color: '#ffffff',
						fontSize: 14
					}

				},
				data: myData.map(function(value) {
					return {
						value: value,
						textStyle: {
							align: 'center' // 进度条左侧文字对齐方式
						}
					}
				})
			}, {
				gridIndex: 2,
				type: 'category',
				inverse: true,
				position: 'left',
				axisLine: {
					show: false
				},
				axisTick: {
					show: false
				},
				axisLabel: {
					show: false

				},
				data: myData
			}],
			series: []

		},
		options: []
	}

	option04.baseOption.timeline.data.push(timeLineData[0])
	option04.options.push({
		series: [
		{
			type: 'pictorialBar',
			xAxisIndex: 2,
			yAxisIndex: 2,
			symbol: 'rect',
			itemStyle: {
				normal: {
					color: 'rgba(54,215,182,0.27)' // 进度条阴影颜色
				}
			},
			barWidth: 10,
			symbolRepeat: true,// 是否显示进度条阴影
			symbolSize: 14, // 进度条阴影格子大小
			data: lineData,
			barGap: '-100%',
			barCategoryGap: 0,
			label: {
				normal: {
					show: true, // 是否显示进度条上方的百分比
					formatter: (series) => {
						return thisYearData[timeLineData[0]][series.dataIndex] + '%'
					},
					position: 'insideTopRight',
					textStyle:{
						color: '#ffffff', // 进度条上方百分比字体颜色
						fontSize: 14,
					},
					offset: [50, -5],
				}
			},
			z: -100,
				animationEasing: 'elasticOut',
				 animationDelay: function (dataIndex, params) {
				return params.index * 30;
			}
		}, {
			name: '2020',
			type: 'pictorialBar',
			xAxisIndex: 2,
			yAxisIndex: 2,
			symbol: 'rect',
			barWidth: 10,
			itemStyle: {
				normal: {
					barBorderRadius: 5,
					color: '#36d7b6'  // 进度条颜色 #36d7b6
				}
			},
			symbolRepeat: true,
			symbolSize: 14,	// 进度条格子大小
			data: thisYearData[timeLineData[0]],
			animationEasing: 'elasticOut',
			animationDelay: function (dataIndex, params) {
				return params.index * 30 * 1.1;
			}
		}
		]
	});
	chart04.setOption(option04);
	chart04.resize();	
}
function loadEchart05(){
	var option05 = {
	 title: {
		text: '门禁告警数量',
		textStyle: {
			fontSize: 14,
			fontWeight: 'normal',
			color: '#fff',
		},
		x: 'left'
	},
		tooltip: {
		  trigger: 'axis',
		  axisPointer: { // 坐标轴指示器，坐标轴触发有效
			type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
		  }
		},
		grid: {
		  left: '2%',
		  right: '4%',
		  bottom: '8%',
		  top:'16%',
		  containLabel: true
		},
		 legend: {
		data: ['门禁常开告警', '门禁离线告警'],
		right: 10,
		top:12,
		textStyle: {
			color: "#fff"
		},
		itemWidth: 12,
		itemHeight: 10,
		// itemGap: 35
	},
		xAxis: {
		  type: 'category',
		  data: ['万城社区','花溪社区','人民社区','齿轮厂家属社区','融创社区','元琦林居社区','花城社区','杨中村'],
		  axisLine: {
			lineStyle: {
			  color: 'white'

			}
		  },
		  axisLabel: {
			// interval: 0,
			// rotate: 40,
			textStyle: {
			  fontFamily: 'Microsoft YaHei'
			}
		  },
		},

		yAxis: {
		  type: 'value',
		  max:'150',
		  axisLine: {
			show: false,
			lineStyle: {
			  color: 'white'
			}
		  },
		  splitLine: {
			show: true,
			lineStyle: {
			  color: 'rgba(255,255,255,0.3)'
			}
		  },
		  axisLabel: {}
		},
		"dataZoom": [{
		  "show": true,
		  "height": 12,
		  "xAxisIndex": [
			0
		  ],
		  bottom:'0%',
		  "start": 10,
		  "end": 90,
		  handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
		  handleSize: '110%',
		  handleStyle:{
			color:"#d3dee5",

		  },
		  textStyle:{
			color:"#fff"},
		  borderColor:"#90979c"
		}, {
		  "type": "inside",
		  "show": true,
		  "height": 15,
		  "start": 1,
		  "end": 35
		}],
		series: [{
		  name: '门禁常开告警',
		  type: 'bar',
		  barWidth: '15%',
		  itemStyle: {
			normal: {
				color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
					offset: 0,
					color: '#fccb05'
				}, {
					offset: 1,
					color: '#f5804d'
				}]),
				barBorderRadius: 12,
			},
		  },
		  data: [10, 30, 40, 120, 50, 90, 60, 40, 15]
		},
		{
		  name: '门禁离线告警',
		  type: 'bar',
		  barWidth: '15%',
		  itemStyle: {
			normal: {
				color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
					offset: 0,
					color: '#8bd46e'
				}, {
					offset: 1,
					color: '#09bcb7'
				}]),
				barBorderRadius: 11,
			}
			
		  },
		  data: [5, 40, 60, 110, 40, 100, 70, 50 ,20]
		}]
	  };
	  chart05.setOption(option05);
	  chart05.resize();	
}
function loadEchart06(){
	var placeHolderStyle = {
	    normal: {
	        label: {
	            show: false
	        },
	        labelLine: {
	            show: false
	        },
	        color: "rgba(0,0,0,0)",
	        borderWidth: 0
	    },
	    emphasis: {
	        color: "rgba(0,0,0,0)",
	        borderWidth: 0
	    }
	};
	var dataStyle = {
	    normal: {
	        formatter: '{c}%',
	        position: 'center',
	        show: true,
	        textStyle: {
	            fontSize: '20',
	            fontWeight: 'normal',
	            color: '#fff'
	        }
	    }
	};
	var option06 = {
	    title: [
	        {
	        text: '民众言论倾向性分析',
	        x: '20',
	        y: '2',
	        textStyle: {
	            color: '#fff',
	            fontSize: 16
	        }
	    },{
	        text: '正面评论',
	        left: '29.8%',
	        top: '66%',
	        textAlign: 'center',
	        textStyle: {
	            fontWeight: 'normal',
	            fontSize: '16',
	            color: '#fff',
	            textAlign: 'center',
	        },
	    }, {
	        text: '负面评论',
	        left: '70%',
	        top: '66%',
	        textAlign: 'center',
	        textStyle: {
	            color: '#fff',
	            fontWeight: 'normal',
	            fontSize: '16',
	            textAlign: 'center',
	        },
	    }],
	    series: [{
	            type: 'pie',
	            hoverAnimation: false, //鼠标经过的特效
	            radius: ['55%', '66%'],
	            center: ['30%', '60%'],
	            startAngle: 225,
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	            label: {
	                normal: {
	                    position: 'center'
	                }
	            },
	            data: [{
	                    value: 75,
	                    itemStyle: {
	                        normal: {
	                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
	                                offset: 0,
	                                color: '#99da69'
	                            }, {
	                                offset: 1,
	                                color: '#01babc'
	                            }]),
	                        }
	                    },
	                    label: dataStyle,
	                }, {
	                    value: 25,
	                    itemStyle: placeHolderStyle,
	                },
	
	            ]
	        },
	        {
	            type: 'pie',
	            hoverAnimation: false,
	            radius: ['55%', '66%'],
	            center: ['70%', '60%'],
	            startAngle: 225,
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	            label: {
	                normal: {
	                    position: 'center'
	                }
	            },
	            data: [{
	                    value: 20,
	                    itemStyle: {
	                        normal: {
	                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
	                                offset: 0,
	                                color: '#9f3edd'
	                            }, {
	                                offset: 1,
	                                color: '#4897f6'
	                            }]),
	                        }
	                    },
	                    label: dataStyle,
	                }, {
	                    value: 80,
	                    itemStyle: placeHolderStyle,
	                },
	
	            ]
	        },
	        
	        //外圈的边框
	        {
	            // name: '总人数',
	            type: 'pie',
	            hoverAnimation: false, //鼠标经过的特效
	            radius: ['61%', '62%'],
	            center: ['30%', '60%'],
	            startAngle: 225,
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	            label: {
	                normal: {
	                    position: 'center'
	                }
	            },
	            data: [{
	                    value: 75,
	                    itemStyle: {
	                        normal: {
	                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
	                                offset: 0,
	                                color: '#01babc'
	                            }, {
	                                offset: 1,
	                                color: '#99da69'
	                            }]),
	                        }
	                    },
	                }, {
	                    value: 25,
	                    itemStyle: placeHolderStyle,
	                },
	
	            ]
	        },
	        {
	            type: 'pie',
	            hoverAnimation: false,
	            radius: ['61%', '62%'],
	            center: ['70%', '60%'],
	            startAngle: 225,
	            labelLine: {
	                normal: {
	                    show: false
	                }
	            },
	            label: {
	                normal: {
	                    position: 'center'
	                }
	            },
	            data: [{
	                    value: 75,
	                    itemStyle: {
	                        normal: {
	                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
	                                offset: 0,
	                                color: '#4897f6'
	                            }, {
	                                offset: 1,
	                                color: '#9f3edd'
	                            }]),
	                        }
	                    },
	                }, {
	                    value: 25,
	                    itemStyle: placeHolderStyle,
	                },
	
	            ]
	        },
	    ]
	};
	chart06.setOption(option06);
	chart06.resize();	
}
function loadEchart08(){
	var cost = [0.2, 0.201, 1]//本期比上期（大于1按1处理）
	var dataCost = [1000.01,200000,200]//真是的金额
	var totalCost = [1, 1, 1]//比例综合
	var visits = [92, 102, 89]//本期占总的百分比*100
	var grade = ['人次用药金额', '药品使用量', '用药金额']
	var data = {
	    title: "**省",
	    grade: grade,
	    cost: cost,
	    totalCost: totalCost,
	    visits: visits,
	    dataCost:dataCost
	};
	var option08 = {
	    title: {
	        top: '5%',
	        left: 'center',
	        text: data.title + '年度用药情况整体统计',
	        textStyle: {
	            align: 'center',
	            color: '#4DCEF8',
	            fontSize: 18
	        }
	    },
	    grid: {
	        left: '200',
	        right: '100',
			bottom:'10%'
	    },
	    xAxis: {
	        show: false,
	    },
	    yAxis: {
	        type: 'category',
	        axisLabel: {
	            margin: 100,
	            show: true,
	            color: '#4DCEF8',
	            fontSize: 14
	        },
	        axisTick: {
	            show: false,
	        },
	        axisLine: {
	            show: false,
	        },
	        data: data.grade
	    },
	    series: [{
	        type: 'bar',
	        barGap: '-100%',
	        label: {
	            normal: {
	                show: true,
	                position: 'right',
	                color: '#fff',
	                fontSize: 14,
	                formatter: 
	                function(param) {
	                    return '同比：'+data.visits[param.dataIndex] +'%';
	                },
	            }
	        },
	        barWidth: '55%',
	        itemStyle: {
	            normal: {
	                borderColor: '#4DCEF8',
	                borderWidth: 2,
	                barBorderRadius: 15,
	                color: 'rgba(102, 102, 102,0)'
	            },
	        },
	        z: 1,
	        data: data.totalCost,
	        // data: da
	    }, {
	        type: 'bar',
	        barGap: '-98%',
	        barWidth: '53%',
	        itemStyle: {
	            normal: {
	                barBorderRadius: 16,
	                color: {
	                    type: 'linear',
	                    x: 0,
	                    x1: 1,
	                    colorStops: [{
	                        offset: 0,
	                        color: '#02ddff'
	                    }, {
	                        offset: 1,
	                        color: '#00feff'
	                    }]
	                }
	            },
	        },
	        max: 1,
	        label: {
	            normal: {
	                show: true,
	                position: 'left',
	                color: '#fff',
	                fontSize: 14,
	                formatter: function(param) {
	                    if(param.dataIndex=='0'){
	                        return data.dataCost[param.dataIndex] + '元';
	                    }
	                    if(param.dataIndex=='1'){
	                       return data.dataCost[param.dataIndex]; 
	                    }
	                    if(param.dataIndex=='2'){
	                      return data.dataCost[param.dataIndex] + '万';  
	                    }
	                },
	            }
	        },
	        labelLine: {
	            show: true,
	        },
	        z: 2,
	        data: data.cost,
	    }]
	}
  chart08.setOption(option08);
  chart08.resize();	
}
$(document).ready(function(){
	loadEchart01();
	loadEchart02();
	loadEchart03();
	loadEchart04();
	loadEchart05();
	loadEchart06();
	loadEchart07();
	loadEchart08();
});